import React, { Component } from 'react';
import { BrowserRouter, Switch, Route, Redirect } from 'react-router-dom';
import routes from './router';

class App extends Component {
    render() {
        return (
            <BrowserRouter>
                <Switch>
                    <Redirect exact from="/" to="/login" />
                    {routes.map((item) => {
                        return (
                            <Route
                                key={item.path}
                                path={item.path}
                                render={(props) => {
                                    // 保存登录数据 => 我们会把用户的登录状态（数据）存储到 sessionStorage
                                    if (
                                        !item.requireLogin ||
                                        window.sessionStorage.getItem('user')
                                    ) {
                                        // match history location
                                        return <item.component {...props} />;
                                    }

                                    return (
                                        <Redirect
                                            to={{
                                                pathname: '/login',
                                                state: {
                                                    redirect:
                                                        props.location.pathname,
                                                },
                                            }}
                                        />
                                    );

                                    // 页面需要登录才能访问
                                    // if (item.requireLogin) {
                                    //     // 用户已登录
                                    //     if (isLogin) {
                                    //         return (
                                    //             <item.component props={props} />
                                    //         );
                                    //         // 用户没登录
                                    //     } else {
                                    //         return <Redirect to="login" />;
                                    //     }
                                    //     // 不需要登录
                                    // } else {
                                    //     return <item.component props={props} />;
                                    // }
                                }}
                            />
                        );
                    })}

                    {/* <Redirect exact from="/" to="/login" />
                    <Route path="/login" component={Login} />
                    <Route path="/register" component={Register} /> */}
                </Switch>
            </BrowserRouter>
        );
    }
}

export default App;
